{include file="public/head"/}
<script language="javascript">
    $(document).ready(function () {
        var lang = $('#lang').text();
        var language = '';
        if (lang == 'pt') {
            language = 'pt-BR';
        } else if (lang == 'en') {
            language = 'en';
        } else {
            language = 'zh-CN';
        }
        // datatimepicker 设置
        $('.form_datetime').datetimepicker({
            language: language, // en ,zh-CN, pt-BR
            format: 'yyyy-mm-dd',
            minView: 'month',
            weekStart: 0, //一周从哪一天开始
            todayBtn: 1, //底部会出现一个今天
            autoclose: true,//自动关闭
            todayHighlight: 1,//高亮今天日期
            startView: 2,//显示的视图
            forceParse: 1,//当选择器关闭的时候，是否强制解析输入框中的值
            showMeridian: 1
        });
    });
</script>
<div class="container-fluid">

    <div class="row clearfix">
        <div class="col-md-12 column">
            <div class="alert alert-dismissable alert-info" id="headeralert">
                <button type="button" class="close">×</button>
                <p></p>
            </div>
        </div>
    </div>
    <div class="ntDesktop">
        <div class="ntDesktop-head">{:strtoupper(lang('journal_accounts_registration'))}</div>
        <div class="row input-panel">
            <div class="col-md-2">
                <label>{:strtoupper(lang('date'))}<span class="required"></span></label>
                <div class="input-group date form_datetime" data-link-field="workdate">
                    <input class="form-control text-center" ref="fkdate" :value="data.dateday" type="text">
                    <span class="input-group-addon"><span class="glyphicon glyphicon-calendar" style="margin:0"></span></span>
                </div>
                <input type="hidden" id="workdate"/>
            </div>
            {eq name="$Think.session.admin.position_id" value="1"}
            <div class="col-md-1">
                <label>{:lang('country')}<span class="required"></span></label>
                <select class="form-control" v-model="country_id" @change="countryjournal">
                    <option value="1">{:lang('BRAZIL')}</option>
                    <option value="2">{:lang('CHINA')}</option>
                </select>
            </div>
            {/eq}

            <div class="col-md-2">
                <label>{:strtoupper(lang('account_subject'))}<span class="required"></span></label>
                <div class="input-group">
                    <div class="input-group-btn">
                        <select class="form-control" v-model="data.account_id">
                            <option value="">{:lang('please_select')}</option>
                            <option :value="item.id" v-for="(item,index) in finaccounts"
                                    :disabled="item.disable==1 ? true:false">
                                <template v-for="(item,index) in item.level" v-cloak>&nbsp;&nbsp;&nbsp;&nbsp;</template>
                                {{item.name}}
                            </option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="col-md-4">
                <label>{:strtoupper(lang('remark'))}<span class="required"></span></label>
                <input type="text" v-model="data.remarks" class="form-control">
            </div>
            <div class="col-md-2">
                <label>{:strtoupper(lang('amount'))}<span class="required"></span></label>
                <input type="number" min="1" @input="changeamount" v-model="data.amount" class="form-control">
            </div>
            <div class="col-md-1 text-right" style="padding-top:1.6em">
                <button type="submit" class="btn btn-primary" :disabled="isdisadble" @click="subfun">
                    <span class="glyphicon glyphicon-floppy-disk"></span> {:lang('save')}
                </button>
            </div>
        </div>
        <div class="row clearfix">
            <div class="col-md-6">
                <ul class="nav nav-tabs">
                    <li class="active">
                        <a href="#daily-list" data-toggle="tab"
                           @click="changejournal('day')">{:strtoupper(lang('daily_accounts'))}</a>
                    </li>
                    <li>
                        <a href="#month-list" data-toggle="tab" @click="changejournal('month')">{:strtoupper(lang('monthly_statistic'))}</a>
                    </li>
                    <li>
                        <a href="#year-list" data-toggle="tab" @click="changejournal('year')">{:strtoupper(lang('annual_statistic'))}</a>
                    </li>
                </ul>
            </div>
            <div class="col-md-6">
                <ul class="nav nav-tabs ">
                    <li class="pull-right">
                        <a href="#" data-toggle="tab" @click="changecountry(1)">{:strtoupper(lang('BRASIL'))}</a>
                    </li>
                    <li class="active pull-right">
                        <a href="#" data-toggle="tab" @click="changecountry(2)">{:strtoupper(lang('CHINA'))}</a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="row tab-content">
            <div class="col-md-12 tab-pane in active" id="daily-list">
                <table class="table table-striped table-hover ntTable" v-cloak>
                    <thead>
                    <tr>
                        <th class="sorting" @click="sortfun(1)" data-order="1">{:strtoupper(lang('date'))}</th>
                        <th> {:strtoupper(lang('subject_name'))}</th>
                        <th> {:strtoupper(lang('remark'))}</th>
                        <th class="sorting" @click="sortfun(2)" data-order="1"> {:strtoupper(lang('amount'))}</th>
                        <th class="sorting" @click="sortfun(3)" data-order="1"> {:strtoupper(lang('edit'))}</th>
                        <th> {:strtoupper(lang('operate'))}</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="item in list" :key="item.id" v-if="list.length>0">
                        <td align="center">{{item.happen_date}}</td>
                        <td>{{item.fin_accountname}}</td>
                        <td>{{item.remarks}}</td>
                        <td class="text-right"><span :class="item.color">{{item.code}}{{formatUnit(item.amount,'$')}}</span> <span
                                class="unit">CNY</span>
                        </td>
                        <td> {{item.updatename}} <br/>
                            <small>{{item.update_date}}</small>
                        </td>
                        <td class="text-right">
                            <div>
                                <!--更改当天、3天、7天、所有权限-->
                                <button v-if="(adminauth_ids.indexOf(168)!=-1&& item.time-item.happen_day < 86400) ||(adminauth_ids.indexOf(169)!=-1&& item.time-item.happen_day < 259200) ||(adminauth_ids.indexOf(170)!=-1&& item.time-item.happen_day < 604800)||adminauth_ids.indexOf(171)!=-1" @click="editdata(item.id)" class='btn btn-sm btn-primary'><span
                                        class="glyphicon glyphicon-pencil"></span>
                                    {:strtoupper(lang('edit'))}
                                </button>
                                <!--删除当天、3天、7天、所有权限-->
                                <a v-if="(adminauth_ids.indexOf(172)!=-1&& item.time-item.happen_day < 86400) ||(adminauth_ids.indexOf(173)!=-1&& item.time-item.happen_day < 259200) ||(adminauth_ids.indexOf(174)!=-1&& item.time-item.happen_day < 604800)||adminauth_ids.indexOf(175)!=-1" href="#" @click.prevent="deldata(item.id,item.remarks)"
                                   class='btn btn-sm btn-default option-del'><span
                                        class="glyphicon glyphicon-remove"></span> {:strtoupper(lang('delete'))}</a>
                            </div>
                        </td>
                    </tr>
                    <tr style="text-align: center;" v-if="list.length==0">
                        <td colspan="6" class="no_date">{:strtoupper(lang('no_data'))}</td>
                    </tr>
                    </tbody>
                    <tfoot>
                    <tr>
                        <td colspan="2">&nbsp;</td>
                        <td>{:strtoupper(lang('current_page_income'))}</td>
                        <!--本页收入-->
                        <td class="text-right"><span class="blue b"><span v-if="moneys.onemoney!=0">+</span>{{formatUnit(moneys.onemoney,'CNY')}}</span> <span

                                class="unit">CNY</span></td>
                        <td colspan="3">&nbsp;</td>
                    </tr>
                    <tr>
                        <td colspan="2">&nbsp;</td>
                        <!--本页支出-->
                        <td>{:strtoupper(lang('current_page_expenditure'))}</td>
                        <td class="text-right"><span class="red b"><span v-if="moneys.twomoney!=0">-</span>{{formatUnit(moneys.twomoney,'CNY')}}</span> <span
                                class="unit">CNY</span></td>
                        <td colspan="3">&nbsp;</td>
                    </tr>
                    <tr>
                        <td colspan="2">&nbsp;</td>
                        <!--本页备注-->
                        <td>{:strtoupper(lang('current_page_remark'))}</td>
                        <td class="text-right"><span class="gray b">{{formatUnit(moneys.threemoney,'CNY')}}</span> <span
                                class="unit">CNY</span></td>
                        <td colspan="3">&nbsp;</td>
                    </tr>
                    <tr>
                        <td colspan="2">&nbsp;</td>
                        <!--本页结余-->
                        <td>{:strtoupper(lang('current_page_balance'))}</td>
                        <td class="text-right"><span :class="classobj"><span v-if="moneys.formoney>0">+</span>{{formatUnit(moneys.formoney,'CNY')}}</span> <span
                                class="unit">CNY</span></td>
                        <td colspan="3">&nbsp;</td>
                    </tr>
                    </tfoot>
                </table>

                <div class="col-md-12">
                    <ul class="pagination" id="pagination_day" v-show="list.length!=0">
                    </ul>
                </div>

            </div>


            <div class="tab-pane" id="month-list">
                <div class="col-md-12 text-center">
                    <ul class="pagination" v-cloak>
                        <li @click="changedate(-1,true)"><a href="#">&laquo;</a></li>
                        <li :class="{active:index==0}" v-for="(item,index) in date" @click="changedate(index,true)"><a
                                href="#">{{item.splyear+'-'+item.month}}</a></li>
                        <li @click="changedate(1,true)"><a href="#">&raquo;</a></li>
                    </ul>
                </div>

                <div class="col-md-12">
                    <table class="table table-striped table-hover ntTable" v-cloak>
                        <thead>
                        <tr>
                            <th>ID</th>
                            <th style="width:40vw"> {:strtoupper(lang('subject_name'))}</th>
                            <th> {:strtoupper(lang('amount'))}</th>
                            <th> {:strtoupper(lang('operate'))}</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr v-for="item in list" :key="item.id" v-if="item.is_show">
                            <td align="center"> <span v-if="item.id">{{formatUnit(item.id,'ID')}}</span></td>
                            <td style="padding-left:0em"><a href="javascript:;"
                                                            @click="folding(item.account_id,!item.toggle)">
                                <template v-for="(item,index) in item.level">&nbsp;&nbsp;&nbsp;&nbsp;</template>
                                <span class="glyphicon glyphicon-plus" style="margin-right:0"
                                      v-if="!item.toggle && item.isexist == 1"></span>
                                <span class="glyphicon glyphicon-minus" style="margin-right:0"
                                      v-if="item.toggle && item.isexist == 1"></span>

                                {{item.fin_accountname}}</a>
                            </td>
                            <td class="text-right"><span :class="item.color">{{item.code}}{{formatUnit(item.amount,'$')}}</span> <span
                                    class="unit">CNY</span></td>
                            <td class="text-right">
                                <div v-if="item.id">
                                    <!--月账单详情month标志-->
                                    <!--查看个人，查看下级员工，查看所有-->
                                    <a v-if="adminauth_ids.indexOf(176)!=-1 || adminauth_ids.indexOf(177)!=-1 || adminauth_ids.indexOf(178)!=-1"   :href="'/admin/finance/journalmonthyear?account_id='+item.account_id+'&happen_day='+item.happen_day+'&month=1'"
                                       class='btn btn-sm btn-primary'
                                       data-toggle="modal"
                                       data-target="#month_detailModal"><span class="fa fa-search-plus"></span>
                                        {:strtoupper(lang('details'))}</a>
                                </div>
                            </td>
                        </tr>
                        <tr style="text-align: center;" v-if="list.length==0">
                            <td colspan="4" class="no_date">{:strtoupper(lang('no_data'))}</td>
                        </tr>
                        </tbody>
                        <tfoot>
                        <tr>
                            <td>&nbsp;</td>
                            <!--上期结余-->
                            <td>{:strtoupper(lang('previous_balance'))}</td>
                            <td class="text-right"><span :class="fivecolor"><span v-if="moneys.fivemoney>0">+</span>{{formatUnit(moneys.fivemoney,'CNY')}}</span> <span class="unit">CNY</span>

                            </td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <!--当月收入-->
                            <td>{:strtoupper(lang('current_month_income'))}</td>
                            <td class="text-right"><span class="blue b"><span v-if="moneys.onemoney!=0">+</span>{{formatUnit(moneys.onemoney,'CNY')}}</span> <span class="unit">CNY</span>
                            </td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <!--当月支出-->
                            <td>{:strtoupper(lang('current_month_expenditure'))}</td>
                            <td class="text-right"><span class="red b"><span v-if="moneys.twomoney!=0">-</span>{{formatUnit(moneys.twomoney,'CNY')}}</span> <span
                                    class="unit">CNY</span></td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <!--当月备注-->
                            <td>{:strtoupper(lang('current_month_remark'))}</td>
                            <td class="text-right"><span class="gray b">{{formatUnit(moneys.threemoney,'CNY')}}</span> <span class="unit">CNY</span>
                            </td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <!--当月结余-->
                            <td>{:strtoupper(lang('current_month_balance'))}</td>
                            <td class="text-right"><span :class="classobj"><span v-if="moneys.formoney>0">+</span>{{formatUnit(moneys.formoney,'CNY')}}</span> <span
                                    class="unit">CNY</span></td>
                            <td>&nbsp;</td>
                        </tr>
                        </tfoot>
                    </table>
                </div>
            </div>


            <div class="tab-pane" id="year-list">
                <div class="col-md-12 text-center">
                    <ul class="pagination" v-cloak>
                        <li @click="changeyear(year[0]+1,true)"><a href="#">&laquo;</a></li>
                        <li :class="{'active':index==0}" v-for="(item,index) in year" @click="changeyear(item,true)"><a
                                href="#">{{item}}</a></li>
                        <li @click="changeyear(year[1],true)"><a href="#">&raquo;</a></li>
                    </ul>
                </div>

                <div class="col-md-12">
                    <table class="table table-striped table-hover ntTable" v-cloak>
                        <thead>
                        <tr>
                            <th>ID</th>
                            <th style="width:40vw"> {:strtoupper(lang('subject_name'))}</th>
                            <th> {:strtoupper(lang('amount'))}</th>
                            <th> {:strtoupper(lang('operate'))}</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr v-for="item in list" :key="item.id" v-if="item.is_show">
                            <td align="center"><span v-if="item.id">{{formatUnit(item.id,'ID')}}</span></td>
                            <td style="padding-left:0em">
                                <a href="javascript:;" @click="folding(item.account_id,!item.toggle)">
                                    <template v-for="(item,index) in item.level">&nbsp;&nbsp;&nbsp;&nbsp;</template>
                                    <span class="glyphicon glyphicon-plus" style="margin-right:0"
                                          v-if="!item.toggle && item.isexist == 1"></span>
                                    <span class="glyphicon glyphicon-minus" style="margin-right:0"
                                          v-if="item.toggle && item.isexist == 1"></span>
                                    {{item.fin_accountname}}
                                </a>
                            </td>
                            <td class="text-right"><span :class="item.color">{{item.code}}{{formatUnit(item.amount,'$')}}</span> <span
                                    class="unit">CNY</span></td>
                            <td class="text-right">
                                <div v-if="item.id">
                                    <!--年账单详情year标志-->
                                    <!--查看个人，查看下级员工，查看所有-->
                                    <a v-if="adminauth_ids.indexOf(176)!=-1 || adminauth_ids.indexOf(177)!=-1 || adminauth_ids.indexOf(178)!=-1" :href="'/admin/finance/journalmonthyear?account_id='+item.account_id+'&happen_day='+item.happen_day+'&year=2'"
                                       class='btn btn-sm btn-primary'
                                       data-toggle="modal"
                                       data-target="#year_detailModal"><span class="fa fa-search-plus"></span>
                                        {:strtoupper(lang('details'))}</a>
                                </div>
                            </td>
                        </tr>
                        <tr style="text-align: center;" v-if="list.length==0">
                            <td colspan="4" class="no_date">{:strtoupper(lang('no_data'))}</td>
                        </tr>
                        </tbody>
                        <tfoot>
                        <tr>
                            <td>&nbsp;</td>
                            <!--上期结余-->
                            <td>{:strtoupper(lang('previous_balance'))}</td>
                            <td class="text-right"><span :class="fivecolor"><span v-if="moneys.fivemoney>0">+</span>{{formatUnit(moneys.fivemoney,'CNY')}}</span> <span class="unit">CNY</span>

                            </td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <!--当年收入-->
                            <td>{:strtoupper(lang("current_year's_income"))}</td>
                            <td class="text-right"><span class="blue b"><span v-if="moneys.onemoney!=0">+</span>{{formatUnit(moneys.onemoney,'CNY')}}</span> <span class="unit">CNY</span>

                            </td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <td>{:strtoupper(lang("current_year's_expenditure"))}</td>
                            <!--当年支出-->
                            <td class="text-right"><span class="red b"><span v-if="moneys.twomoney!=0">-</span>{{formatUnit(moneys.twomoney,'CNY')}}</span> <span
                                    class="unit">CNY</span></td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <!--当年备注-->
                            <td>{:strtoupper(lang("current_year's_remark"))}</td>
                            <td class="text-right"><span class="gray b">{{formatUnit(moneys.threemoney,'CNY')}}</span> <span class="unit">CNY</span>

                            </td>
                            <td>&nbsp;</td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <!--当年结余-->
                            <td>{:strtoupper(lang("current_year's_balance"))}</td>
                            <td class="text-right"><span :class="classobj"><span v-if="moneys.formoney>0">+</span>{{formatUnit(moneys.formoney,'CNY')}}</span> <span

                                    class="unit">CNY</span></td>
                            <td>&nbsp;</td>
                        </tr>
                        </tfoot>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<!--日记账-当年清-->
<div class="modal fade" id="year_detailModal" tabindex="-1" role="dialog" aria-labelledby="ntModalLabel"
     aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content" style="width:1000px">

        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
<!--日记账-当月清-->
<div class="modal fade" id="month_detailModal" tabindex="-2" role="dialog" aria-labelledby="ntModalLabel"
     aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content" style="width:1000px">

        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
<!--弹窗部分 结束-->
{include file="public/foot"/}
<script>
    var table = new Vue({
        el: '.ntDesktop',
        data: {
            date: [],
            year: [],
            current: {},
            list: [],
            moneys: [],
            classobj:{
                red:false,blue:false,gray:false,b:true
            },
            fivecolor:{
                red:false,blue:false,gray:false,b:true
            },
            finaccounts: [],
            page: 1,
            pageSize: 30,
            journal: 'day',
            counid: '2',
            country_id: '2',
            order: 1,
            pauname: '',
            data: {
                dateday: '',//默认时间
                account_id: '',//上级科目
                remarks: '',//备注
                amount: '',//金额
                id: '',//编辑的id
            },
            isdisadble: false,
            adminauth_ids:$('#adminauth_ids').text(),//用户当前页面的权限
        },
        methods: {
            formatUnit:formatUnit,
            setPage(pageCurrent, pageSum) {
                //数据总条数
                var myPageCount = pageSum;
                //一页显示多少条
                var myPageSize = this.pageSize;
                //总页数
                var countindex = myPageCount % myPageSize > 0 ? (myPageCount / myPageSize) + 1 : (myPageCount / myPageSize);
                $.jqPaginator('#pagination' + '_' + this.journal, {
                    totalPages: parseInt(countindex),
                    //最多显示多少页
                    visiblePages: 5,
                    //默认显示第几页
                    currentPage: pageCurrent,
                    first: '<li class="first"><a href="javascript:;">' + langcon.page_home + '</a></li>',
                    prev: '<li class="prev"><a href="javascript:;"><i class="arrow arrow2"></i>' + langcon.previous_page + '</a></li>',
                    next: '<li class="next"><a href="javascript:;">' + langcon.next_page + '<i class="arrow arrow3"></i></a></li>',
                    last: '<li class="last"><a href="javascript:;">' + langcon.last_page + '</a></li>',
                    page: '<li class="page"><a href="javascript:;">{{page}}</a></li>',
                    all:'<li class="page"><a href="javascript:;">'+myPageCount+' / '+this.page+'PG , '+this.pageSize+' /PG</a></li>',
                    onPageChange: (num, type) => {
                        if (type == "change") {
                            this.page = num
                            this.getAllList()
                        }
                    }
                });
            },
            //数据所有获取
            getAllList(){
                $('.loding').show();
                $.ajax({
                    url: "/admin/finance/journal",
                    type: 'post',
                    data: {
                        page: this.page,//分页
                        pageSize: this.pageSize,//条数
                        journal: this.journal,//标签切换
                        getjournal: '',//获取标志
                        country_id: this.counid,//国家切换,
                        year: this.current.year,//年
                        month: this.current.month//月
                    },
                    dataType: "json",
                    success: (result) => {
                        if(result){
                            $('.loding').hide();
                            this.data.dateday = result.dateday
                            this.list = result.getjournals;
                            if(result.moneys.formoney>0){
                                this.classobj.blue=true;
                                this.classobj.red=false;
                                this.classobj.gray=false;
                            }else if(result.moneys.formoney<0) {
                                this.classobj.red=true;
                                this.classobj.gray=false;
                                this.classobj.blue=false;
                            }else {
                                this.classobj.gray=true;
                                this.classobj.red=false;
                                this.classobj.blue=false;
                            }
                            if(result.moneys.fivemoney>0){
                                this.fivecolor.blue=true;
                                this.fivecolor.red=false;
                                this.fivecolor.gray=false;
                            }else if(result.moneys.fivemoney<0){
                                this.fivecolor.red=true;
                                this.fivecolor.blue=false;
                                this.fivecolor.gray=false;
                            }else {
                                this.fivecolor.gray=true;
                                this.fivecolor.red=false;
                                this.fivecolor.blue=false;
                            }
                            this.moneys = result.moneys;
                            if (result.finaccounts) {
                                //不是全球管理员
                                this.finaccounts = result.finaccounts;
                            } else {
                                //是全球管理员
                                this.countryjournal();
                            }
                            //折叠数据插入
                            this.list.map(Element => {
                                if (Element.level <= 1) {
                                    Element.is_show = true
                                } else {
                                    Element.is_show = false
                                }

                                if (Element.level == 0) {
                                    Element.toggle = true//打开
                                } else {
                                    Element.toggle = false//打开
                                }
                            })
                            // 将数据渲染到页面
                            if (this.journal == 'day') {
                                $('#pagination' + '_' + this.journal).show()
                                if(result.size)
                                this.setPage(parseInt(this.page), result.size)
                            }
                        }
                        $('.loding').hide()
                    }
                })
            },
            changeamount(){
                if(this.data.amount<=0){
                    this.data.amount=1;
                }
            },
            //排序
            sortfun(type, $event){
                this.order = $(event.target).attr('data-order')
                if (type == 1) {
                    this.pauname = 'happen_day'
                    this.list.sort(this.sortoneData);
                }
                if (type == 2) {
                    this.pauname = 'amount'
                    this.list.sort(this.sortoneData);
                }
                if (type == 3) {
                    this.pauname = 'update_at'
                    this.list.sort(this.sortoneData);
                }
            },
            sortoneData(a, b) {
                if (this.order == 1) {
                    $(event.target).attr('data-order', 2)
                    return b[this.pauname] - a[this.pauname]
                } else {
                    $(event.target).attr('data-order', 1)
                    return a[this.pauname] - b[this.pauname]
                }
            },
            //切换标签
            changejournal(journal){
                this.journal = journal;
                this.page = 1;
                if (journal == 'year') {
                    this.current.year = this.year[0]
                    this.current.splyear = ''
                    this.current.month = ''
                } else {
                    this.current = JSON.parse(JSON.stringify(this.date[0]))
                }
                this.current
                this.getAllList();
            },
            //获取不同国家的数据
            changecountry(counid){
                this.counid = counid;
                this.page = 1;
                this.getAllList();
            },
            //获取不同国家下的科目
            countryjournal(){
                $.ajax({
                    url: "/admin/finance/journal",
                    type: 'post',
                    data: {
                        country_id: this.country_id,
                        finaccounts: '',//获取标志
                    },
                    dataType: "json",
                    success: (result) => {
                        this.finaccounts = result;
                    }
                })
            },
            subfun(){
                this.isdisadble=true;
                    if (this.data.id) {
                        //编辑
                        this.data.act = 'journaledit'
                    } else {
                        //添加
                        this.data.act = 'journaladd'
                    }
                    var data = {
                        act: this.data.act,
                        id: this.data.id,
                        happen_day: this.data.dateday,
                        account_id: this.data.account_id,
                        remarks: this.data.remarks,
                        amount: this.data.amount,
                    }
                    $.ajax({
                        url: '/admin/api/journaladdedit',
                        data,
                        type: 'post',
                        success: (data) => {
                            data = JSON.parse(data)
                            change_mes_type('#headeralert',data.status)
                            $('#headeralert').show()
                            $('#headeralert p').html('*' + data.msg + '<br>')
                            if(data.status==1){
                                //清空数据
                                this.data.remarks = '';
                                this.data.amount = '';
                                this.data.account_id = '';
                                this.country_id = '2';
                                this.getAllList();//获取列表数据
                            }
                            this.isdisadble=false;
                        }
                    })
            },
            //点击编辑,请求接口，渲染数据
            editdata(id){
                $.ajax({
                    url: '/admin/finance/journaledit',
                    data: {
                        id: id,
                    },
                    type: 'post',
                    dataType: 'json',
                    success: (data) => {
                        //判断权限
                        if (data.status != 1) {
                            change_mes_type('#headeralert',data.status)
                            $('#headeralert').show()
                            $('#headeralert p').html('*' + data.msg + '<br>')
                        } else {
                            this.data.dateday = data.msg.happen_date;//日期
                            this.country_id = data.msg.country_id;//国家
                            this.data.account_id = data.msg.account_id;//记账科目
                            this.data.remarks = data.msg.remarks;//备注
                            this.data.amount = data.msg.amount;//金额
                            this.data.id = data.msg.id;
                            this.countryjournal();//获取不同国家下的科目
                        }
                    }
                })
            },
            //日记账的删除
            deldata(id, name){
                $.ajax({
                    url: '/admin/finance/journaldel',
                    type: 'post',
                    data: {
                        id,
                        name
                    },
                    success: (res) => {
                        res = JSON.parse(res)
                        change_mes_type('#headeralert',res.status)
                        if(res.status==1){
                            $('#headeralert').show()
                            $('#headeralert p').html('*' + res.msg + '<br>')
                            if (!(this.list.length - 1)) {
                                if(this.page>1){
                                    this.page--
                                }
                            }
                            this.getAllList()
                        }
                    }
                })
            },
            changedate(index, is_change){
                if (index >= 0) {
                    this.date[0] = JSON.parse(JSON.stringify(this.date[index]))
                    this.current = JSON.parse(JSON.stringify(this.date[0]))
                    var time = JSON.parse(JSON.stringify(this.date[0]))
                } else {
                    var time = JSON.parse(JSON.stringify(this.date[0]))
                    if (time.month + 1 == 13) {
                        time.year++
                        time.splyear++
                        time.month = 1
                    } else {
                        time.month++
                    }
                    this.date[0] = JSON.parse(JSON.stringify(time))
                    this.current = JSON.parse(JSON.stringify(this.date[0]))
                }
                for (var i = 1; i < 12; i++) {
                    if (time.month - 1 == 0) {
                        time.year--
                        time.splyear--
                        time.month = 12
                    } else {
                        time.month--
                    }
                    this.date.splice(i, 1, JSON.parse(JSON.stringify(time)))
                }
                if (is_change) {
                    this.getAllList()
                }
            },
            changeyear(year, is_change){
                this.year.splice(0)
                this.year[0] = year
                for (var i = 1; i < 12; i++) {
                    this.year.push(year - i)
                }
                this.current.year = this.year[0]
                if (is_change) {
                    this.getAllList()
                }
            },
            openparent(pid){
                this.list.map(item => {
                    if (item.pid == pid) {
                        item.is_show = true
                        id = item.pid
                        if (item.level != 0)
                            this.openparent(item.account_id)
                    }
                })

            },
            folding(id, toggle){
                this.list.map(item => {
                    if (item.level <= 1) {
                        item.is_show = true
                    } else {
                        item.is_show = false
                    }

                    if (item.level == 0) {
                        item.toggle = true//打开
                    } else {
                        item.toggle = false//打开
                    }
                })
                this.togglechild(id, toggle)
            },
            togglechild(id, toggle){
                this.list = this.list.map(Element => {
                    if (Element.account_id == id) {
                        Element.toggle = toggle
                    }
                    if (Element.pid == id) {
                        Element.is_show = toggle
                        //关闭所有子级
                        if (!toggle && Element.isexist == 1) {
                            this.folding(Element.account_id, toggle)
                        }
                        //反向打开父级
                        if (toggle) {
                            this.openparent(Element.pid)
                        }
                    }
                    return Element
                })
            },
            Money(value, num) {
                num = num > 0 && num <= 20 ? num : 2;
                value = parseFloat((value + "").replace(/[^\d\.-]/g, "")).toFixed(num) + ""; //将金额转成比如 123.45的字符串
                var valueArr = value.split(".")[0].split("") //将字符串的数变成数组
                const valueFloat = value.split(".")[1]; // 取到 小数点后的值
                let valueString = "";
                for (let i = 0; i < valueArr.length; i++) {
                valueString += valueArr[i] + ((i + 1) % 3 == 0 && (i + 1) != valueArr.length ? "," : ""); //循环 取数值并在每三位加个','
                }
                const money = valueString.split("").join("") + "." + valueFloat; //拼接上小数位
                return money
            }
        },
        mounted(){
            var date = new Date()
            var time = {
                year: date.getFullYear(),
                splyear: date.getFullYear().toString().slice(2, 4) - 0,
                month: date.getMonth() + 1
            }
            this.year[0] = date.getFullYear()
            this.date[0] = JSON.parse(JSON.stringify(time))
            this.current = this.date[0]
            this.changedate(0, false)
            this.changeyear(date.getFullYear(), false)
            this.getAllList(1);
            this.countryjournal();//获取上级科目
            $('.form_datetime').on('changeDate', (e) => {
                this.data.dateday = this.$refs.fkdate.value
            });
        }
    })
    $("#month_detailModal").on("hidden.bs.modal", function () {
        $(this).removeData("bs.modal");
        $(document).unbind('keydown')
    });
    $("#year_detailModal").on("hidden.bs.modal", function () {
        $(this).removeData("bs.modal");
        $(document).unbind('keydown')
    });
</script>

